/*
 * Copyright © 2021-2023 Innospots (http://www.innospots.com)
 *  Licensed to the Apache Software Foundation (ASF) under one or more
 *  contributor license agreements.  See the NOTICE file distributed with
 *  this work for additional information regarding copyright ownership.
 *  The ASF licenses this file to You under the Apache License, Version 2.0
 *  (the "License"); you may not use this file except in compliance with
 *  the License. You may obtain a copy of the License at
 *
 *  http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */

@import '~antd/lib/style/themes/default.less';

.previewContent {
  padding: 12px 24px 80px;

  :global {
    .@{ant-prefix}-tabs-nav {
      margin-bottom: 0;
      padding: 0 12px;

      .@{ant-prefix}-tabs-tab {
        padding-right: 12px;
        padding-left: 12px;
      }
    }
  }

  &.configEls2 {
    .contentBox {
      min-height: 240px;
    }
  }

  .logContent,
  .jsonContent {
    background: #fafafa;
  }

  .jsonContent {
    max-height: 300px;

    overflow: auto;

    [name='labels'] {
      display: none !important;
    }

    [name='body'] {
      font-size: 14px !important;
    }
  }
}

.contentBox {
  padding: 12px;
  overflow: hidden;
  min-height: 530px;
  max-width: 746px;

  :global {
    .@{ant-prefix}-table-row td {
      padding-top: 10px !important;
      vertical-align: text-top;
    }
  }

  &.attachmentContainer {
    height: 530px;
    overflow-y: auto;
    padding-left: 0;
    padding-right: 0;

    :global {
      .@{ant-prefix}-collapse-header {
        background-color: #fafafa;
        .@{ant-prefix}-collapse-header-text {
          font-weight: 500;
        }
      }
    }

    .attachCard {
      width: 100%;
      height: 250px;
      border: 1px solid #f1f1f1;
      border-radius: 8px;
      box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);

      .cardInner {
        padding: 10px;

        .cardHead {
          height: 38px;
          display: flex;
          align-items: center;
          margin: -10px 0 12px;
          border-bottom: 1px solid @border-color-base;

          span {
            color: var(--ant-primary-color);
            font-size: 14px;
            font-weight: 500;
          }
        }

        .cardContent {
          p {
            font-size: 12px;
            margin-bottom: 0;
          }

          .title {
            color: #333;
            font-weight: 500;
          }

          .text {
            color: #666;
          }

          .fileBlock {
            margin-bottom: 8px;
          }

          .fileBox {
            height: 96px;
            padding: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            border-radius: 6px;
            background-color: #f8f8f8;

            &.ghost {
              background-color: #fff;
            }

            .downloadBtn {
              min-width: 120px;
              font-size: 12px;
            }

            img {
              max-height: 100%;
            }
          }
        }
      }
    }
  }
}

.previewNode {
  position: relative;
  height: 100%;

  .previewHeader {
    height: 64px;
    padding: 0 24px;
    border-bottom: 1px solid #e8e8e8;

    :global {
      .@{ant-prefix}-typography {
        margin-bottom: 0;
      }
    }
  }

  .previewFooter {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 12px 24px 12px 0;
    text-align: right;
    border-top: 1px solid #e8e8e8;
  }
}

.table {
  padding-top: 24px;
  overflow-x: auto;

  :global {
    table {
      border-spacing: 0 0;
    }
  }
}
